<style>
    .order-title{
        height: 40px;
        line-height: 40px;
        font-size: 12px;
        color: #666;
    }
    .order-title span{
        padding-right:15px;
    }
    .order_block{
        border:2px solid rgba(240, 240, 240, 1);
    }
    .order_part_top{
        border-bottom: 1px solid rgba(240, 240, 240, 1);
    }
    .order_part_left{
        padding: 28px 12px 0 31px;
    }
    .order-status-tip{
        font-size: 20px;
        margin-bottom: 18px;
        font-weight: bold;
        color: #333;
    }
    .order-status-info{
        font-size: 12px;
        color: #999;
        margin-bottom: 12px;
    }
    .common-btn {
        width: 88px;
        text-align: center;
        height: 30px;
        color: #fff;
        border-radius: 4px;
        cursor: pointer;
        margin-bottom: 12px;
    }
    .addremark_text{
        color: #18bc9c;
        cursor: pointer;
    }
    .order_part_right{
        padding-top:50px;
    }
    .order-msg-center{
        padding: 42px 62px;
    }
    .tip_info p{
        display: inline-block;
        vertical-align: top;
        color: #999;
        white-space: normal;
        max-width: 85%;
    }
    .tip_info>div{
        white-space: nowrap;
    }
    .tip_info{
        padding: 10px 20px;
    }
    .order_msg_cir{
        width: 38px;
        height:38px;
        margin:0 auto;
        border: 4px solid #fff;
        border-radius: 50px;
        background-color: #18bc9c;
        display: none;
        position: relative;
        z-index: 20;
        text-align: center;
        line-height: 38px;
    }
    .order_msg_cir span{
        transform: scaleX(1.5);
    }
    .order_msg_num{
        width: 38px;
        height:38px;
        margin:0 auto;
        border: 4px solid #fff;
        border-radius: 50px;
        background-color: #eee;
        color: #fff;
        position: relative;
        z-index: 20;
        text-align: center;
        line-height: 38px;
    }
    .order-msg-center p{
        margin-bottom:0;
    }
    .order-msg-line{
        left: 50%;
        right: -50%;
        top:18px;
        height:2px;
        background-color: #C0C4CC;
        position: absolute;
        width: 80%;
    }
    .pr{
        position: relative;
    }
    .order-msg-center>div>div:nth-last-child(1) .order-msg-line{
        display: none;
    }
    .ischeck .order_msg_num{
        display: none;
    }
    .ischeck .order_msg_cir,.ischeck .order_msg_cir .order-msg-line{
        display: block;
        background-color: #18bc9c;
        color: #ffffff;
    }
    .order_pay_block{
        font-size:12px;
        color: #666;
    }
    .order_pay_block p span{
        width: 54px;
        display: inline-block;
        vertical-align: top;
    }
    .order_pay_block{
        background-color: #f8f8f8;
        border: 2px solid #F0F0F0;
        margin-top: 14px;
        margin-bottom: 12px;
    }
    .order_pay_block>div{
        padding:20px 0 20px 20px;
    }
    .headerImg{
        display: inline-block;
        vertical-align: middle;
        width: 54px;
        height:54px;
        margin-right: 20px;
        border-radius: 50%;
        background-color: #ffffff;
    }
    .table_content{
        width:100%;
        overflow-x: scroll;
    }
    .table_content table{
        /*width:1500px;*/
        vertical-align: middle;
    }
    .table_content td{
        padding: 12px 8px!important;
        vertical-align: middle!important;
        font-size: 12px;
        color: #666;
        text-align: center;
    }
    .shop_text{
        text-align: left;
    }
    .shop_text img{
        width: 50px;
        height:50px;
        margin-right: 14px;
        display: block;
        float: left;
    }
    .shop_text>div{
        width: 200px;
    }
    .address_text>div{
        display: inline-block;
        vertical-align: middle;
    }
    .address_text{
        display: inline-block;
        vertical-align: middle;
    }
    .address_text p{
        display: inline-block;
        vertical-align: middle;
    }
    .order_pay_block .form-inline{
        display: inline-block;
        vertical-align: middle;
        margin-top: 5px;
    }
    /*.order_part_right*/
</style>
<form id="edit-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">
    <div class="order-title">
        <span>订单号:{$row.order_no}</span>
        <span>下单时间:{$row.createtime|datetime}</span>
        <!--<span>订单来源</span>-->
    </div>
    <div class="order_block">
        <div class="order_part_top">
            <div class="form-group">
                <div class="col-xs-12 col-sm-6 order_part_left">
                    <p class="order-status-tip">{$row.state_text}</p>
                    <!--                    <p class="order-status-info">买家若在设置天数内未确认收货，系统将自动确认收货完成订单</p>-->
                    <div>
                        {switch name="row.state"}
                        {case value="-1"}
                        <div class="">订单已取消</div>
                        {/case}
                        {case value="0"}
                        <div class="">订单待支付</div>
                        {/case}
                        {case value="1"}
                        <div class="form-group" style="margin-left: 0;margin-right: 0;margin-bottom: 10px">
                            <p class="col-xs-2 col-sm-3" style="padding-left: 0;padding-top: 8px;margin-bottom: 0">快递公司</p>
                            <select name="row[express_company_id]" id="" class="form-control col-xs-8 col-sm-8" style="width: 40%">
                                {notempty name="companys"}
                                {volist name="companys" id="vo"}
                                <option value="{$key}">{$vo}</option>
                                {/volist}
                                {/notempty}
                            </select>
                        </div>
<!--                        <div class="form-group" style="margin-left: 0;margin-right: 0;margin-bottom: 10px">-->
<!--                            <p class="col-xs-2 col-sm-3" style="padding-left: 0;padding-top: 8px;margin-bottom: 0">快递单号</p>-->
<!--                            <input type="text" name="row[express_no]" class="form-control col-xs-8 col-sm-8" style="width: 40%">-->
<!--                        </div>-->
<!--                        <button type="submit" class="common-btn btn btn-success btn-embossed" id="send">立即发货</button>-->
                        {/case}
                        {case value="2"}

                        {/case}
                        {case value="3"}

                        {/case}
                        {case value="4"}

                        {/case}
                        {case value="5"}

                        {/case}
                        {/switch}

                    </div>
<!--                    <p class="addremark_text">添加备注</p>-->
                    <p >平台备注：<span id="admin_note">{$row.admin_note}</span></p>
                </div>
                <div class="col-xs-12 col-sm-6 order_part_right">
                    <p><span>商品总价：</span> ￥{$row.total_price}</p>
                    <p><span>运    费：</span> ￥{$row.express_price}</p>
                    <p><span>订单金额：</span> <i style="font-size: 20px;color: #FF5000;font-style: normal">￥{$row.pay_price}</i></p>
                </div>
            </div>
            <div class="order-msg-center">
                <div class="form-group">
                    <div class="col-xs-2 pr ischeck">
                        <div class="order_msg_cir"><span>√</span></div>
                        <div class="order_msg_num">1</div>
                        <div class="order-msg-line"></div>
                        <p style="color: #444;line-height: 38px;text-align: center;font-size: 16px;">买家下单</p>
                        <p style="color: #999;line-height: 20px;text-align: center;font-size: 12px;margin-top: -5px">{$row.createtime|datetime}</p>
                    </div>
                    <div class="col-xs-2 pr {$row.state>=1?'ischeck':''}">
                        <div class="order_msg_cir"><span>√</span></div>
                        <div class="order_msg_num">2</div>
                        <div class="order-msg-line"></div>
                        <p style="color: #444;line-height: 38px;text-align: center;font-size: 16px;">买家付款</p>
                        <p style="color: #999;line-height: 20px;text-align: center;font-size: 12px;margin-top: -5px">{$row.pay_time?$row.pay_time_text:''}</p>
                    </div>
                    <div class="col-xs-2 pr {$row.state>=2?'ischeck':''}">
                        <div class="order_msg_cir"><span>√</span></div>
                        <div class="order_msg_num">3</div>
                        <div class="order-msg-line"></div>
                        <p style="color: #444;line-height: 38px;text-align: center;font-size: 16px;">商家发货</p>
                        <p style="color: #999;line-height: 20px;text-align: center;font-size: 12px;margin-top: -5px">{$row.freight_time?$row.freight_time_text:''}</p>
                    </div>

                    <div class="col-xs-2 pr {$row.state>=3?'ischeck':''}">
                        <div class="order_msg_cir"><span>√</span></div>
                        <div class="order_msg_num">4</div>
                        <div class="order-msg-line"></div>
                        <p style="color: #444;line-height: 38px;text-align: center;font-size: 16px;">交易完成</p>
                        <p style="color: #999;line-height: 20px;text-align: center;font-size: 12px;margin-top: -5px">{$row.receipt_time?$row.receipt_time_text:''}</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="tip_info">
            <div class="">
                <p style="color: #128f76;">温馨提示：</p>
                <p>1、如果无法发货，请及时与买家联系并说明情况后进行退款；2、买家申请退款后，须征得买家同意后发货，否则买家有权拒收货物</p>
            </div>
            <div class="">
                <p style="color: #128f76;">买家留言：</p>
                <p>{$row.remarks}</p>
            </div>
        </div>
    </div>
    {neq name="row.order_type" value="2"}
    <div class="order_pay_block " style="margin-left: 0;margin-right: 0">
        <div class="">
            <p style="color: #333">收货信息</p>
            <form method="post" id="address-form">
                <div>
                    <p style="padding-top: 15px;margin-bottom: 0;width: 40%;display: inline-block;vertical-align: middle;"><span style="padding-top: 5px;margin-right: 5px">收货人:</span><input type="text" name="name" style="border: 1px solid #f0f0f0;outline: 0;border-radius: 3px;height: 30px;" value="{$row.order_address ? $row.order_address.name : ''}"></p>
                    <p style="padding-top: 15px;margin-bottom: 0;width: 40%;display: inline-block;vertical-align: middle;"><span style="padding-top: 5px;margin-right: 5px">联系电话:</span><input type="text" name="mobile" style="border: 1px solid #f0f0f0;outline: 0;border-radius: 3px;height: 30px;"  value="{$row.order_address.mobile}"></p>
                </div>

                <div class="address_text" style="padding-top: 5px">
                    <p class="" style="line-height: 38px"><span>收货地址</span>:</p>
                    {:Form::cxselect('xilumarket/ajax/area', ['province','city','region'], ['province'=>$row.order_address.province_id, 'city'=>$row.order_address.city_id, 'region'=>$row.order_address.region_id])}
                </div>

                <p style="padding-top: 15px">
                    <span style="display: inline-block;vertical-align: middle;">详细地址</span>:
                    <input type="text" name="address_detail" style="border: 1px solid #f0f0f0;outline: 0;border-radius: 3px;height: 30px;margin-top: -5px;width: 80%"  value="{$row.order_address.address_detail}">
                </p>
            </form>
        </div>
        <div class="form-group">
            <div class="col-xs-6 col-sm-6">
                <p style="color: #333">付款信息</p>
                <p><span>实付金额</span>:{$row.pay_price}</p>
                <p><span>付款方式</span>:{$row.pay_type}</p>
                <p><span>付款时间</span>:{:$row.paytime?datetime($row.paytime):''}</p>
            </div>
            <div class="col-xs-6 col-sm-6">
                <p style="color: #333">下单用户</p>
                <div >
                    <div class="headerImg">
                        <img src="{$row.user.avatar}" width="100%" height="100%" />
                    </div>
                    <div style="display: inline-block;vertical-align: middle">
                        <p><span>ID</span>:{$row.user.id}</p>
                        <p><span>昵称</span>:{$row.user.nickname}</p>
                        <p><span>联系方式</span>:{$row.user.mobile}</p>
                    </div>
                </div>


            </div>
        </div>
    </div>
    {/neq}
    {if condition="!empty($row.express_no)"}
    <div class="order_pay_block " style="margin-left: 0;margin-right: 0">

        <div class="">
            <p style="color: #333">物流信息</p>
            <p style="padding-top: 15px;margin-bottom: 0"><span>物流公司</span>:{$row.express_name}</p>
            <p style="padding-top: 15px;margin-bottom: 0"><span>物流单号</span>:{$row.express_no}</p>

        </div>
    </div>
    {/if}

    <div class="table-responsive table_content">
        <table class="table table-condensed table-hover">
            <thead>
            <td>商品</td>
            <td>单价（元）</td>
            <td>数量</td>
            <!--<td>优惠（元）</td>-->
            <!--<td>小计（元）</td>-->
            <!--<td>订单类型</td>-->
            <!--<td>配送方式</td>-->
            <!--<td>发货状态</td>-->
            <!--<td>退款状态</td>-->
            <!--<td>售后状态</td>-->
            <!--<td>配送信息</td>-->
            <!--<td>评价状态</td>-->
            <!--            <td>物流公司</td>-->
            <!--            <td>物流单号</td>-->
            </thead>
            <tbody>
            {volist name="row.order_product" id="vo"}
            <tr>
                <td>
                    <div class="shop_text">
                        <img src="{:cdnurl($vo.image)}" alt="">
                        <div>
                            <p>{$vo.product_name}</p>
                        </div>
                    </div>
                </td>
                <td>￥{$vo.product_price}</td>
                <td>{$vo.total_num}</td>
                <!--<td>￥12.00</td>-->
                <!--<td>-->
                <!--<p>￥12.00</p>-->
                <!--<del>￥12.00</del>-->
                <!--</td>-->
                <!--<td>商城订单</td>-->
                <!--<td>自动发货</td>-->
                <!--<td>待收货</td>-->
                <!--<td>主动退款</td>-->
                <td>{$row.express_name}</td>
                <!--                <td><a href="{:url('order/order/wuliu',['order_id'=>$row.id,'company_id'=>0,'express_no'=>$row.express_no,'type'=>'order'])}" class="btn-dialog">{$row.express_no}</a></td>-->
            </tr>
            {/volist}
            </tbody>
        </table>
    </div>
    <!--<div class="form-group layer-footer">-->
    <!--<label class="control-label col-xs-12 col-sm-2"></label>-->
    <!--<div class="col-xs-12 col-sm-8">-->
    <!--<button type="submit" class="btn btn-success btn-embossed disabled">{:__('OK')}</button>-->
    <!--<button type="reset" class="btn btn-default btn-embossed">{:__('Reset')}</button>-->
    <!--</div>-->
    <!--</div>-->
</form>
